<template>
    <div class="module-view">
        <a-card>
            <a-form name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off"
                @finish="decrypt">
                <a-form-item label="加密用户名" name="encriptUsername">
                    <a-input-group compact>
                        <a-input v-model:value="encryptUsername" style="width: 70%" />
                    </a-input-group>
                </a-form-item>

                
                <a-form-item :wrapper-col="{ offset: 8, span: 16 }">
                    <a-button type="primary" @click="decrypt">解密</a-button>
                </a-form-item>

                <a-form-item label="用户名" name="username">
                    <a-input v-model:value="username" />
                </a-form-item>
            </a-form>
        </a-card>
    </div>
</template>
<script setup>
import { ref } from 'vue';

const encryptUsername = ref('');
const username = ref('');

const decrypt = async () => {
    const result = await window.electron.ipcRenderer.invoke('decrypt', {
            target: encryptUsername.value,
    });
    username.value = result;
}


</script>
<style scoped>
.module-view {
    width: 100%;
    height: 100%;
}
</style>